<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		 <!--[if lt IE 9]>
    <script src="../js/jquery-1.11.3.js"></script>
    
<![endif]-->
<!--[if gte IE 9]><!-->
    <script src="../js/jquery-3.1.1.js"></script>
<!--<![endif]-->
<script type="text/javascript">
$(document).ready(function(){
  $("a").click(function(event){
	event.preventDefault();//防止链接打开 URL
	alert("检查 preventDefault() 是否被调用: " + event.isDefaultPrevented());
  });
  	$("#div1").click(function(event){
		alert("事件句柄 1 被执行");
		//event.stopImmediatePropagation();//阻止其他事件处理程序被调用
			alert("检测 event.stopImmediatePropagation() 是否被调用: " +  event.isImmediatePropagationStopped());
	});
  	$("#div1").click(function(event){
		alert("事件句柄 2 被执行");
	
	});

  $("#div2 span").click(function(event){
    event.stopPropagation();//阻止 click 事件冒泡到父元素：
   // alert(event.isPropagationStopped());
    alert("The span element was clicked.");
  });
  $("p").click(function(event){
    alert("The p element was clicked.");
  });
  $("#div2").click(function(){
    alert("The div element was clicked.");
  });

});
function func (){
	//alert("检查");
	this.location.href="http://www.163.com/";
}
</script>
	</head>
	<body>
	
<a href="http://www.163.com/">连接1</a>，
<a href="#" onclick="func()">连接2</a>
<p>preventDefault() 方法用于防止链接打开 URL。</p>

<div id="div1" style="height:40;width:300px;padding:10px;border:1px solid blue;background-color:lightblue;">
	点击这个 div 元素。</div>


<div id="div2" style="height:100px;width:500px;padding:10px;border:1px solid blue;background-color:lightblue;">
This is a div element.
<p style="background-color:pink">This is a p element, in the div element. 
	<br><span style="background-color:orange">
		This is a span element in the p and the div element.</span>
</p>
</div>

	</body>
</html>
